<template>
<div>
    <div class="index_title">
		<div class="left">
			<i class="icon iconfont icon-hot"></i>
			优选单品
		</div>
	</div>

<div id="youxuan"  v-infinite-scroll="getGoods" infinite-scroll-disabled="loading" infinite-scroll-distance="10">
    <div class="mod-bd">
        <div class="jPage" data-page="1">
            <div class="" data-page="1">
                <div class="mod-item jProductItem" v-for="(item, key) in list">
                    <a href="#"><img :src="item.img" class="jImg gd-img"/>
                        <!-- <div class="gd-tag"></div>
                        <div class="gd-labels"></div> -->
                        <div class="gd-info">
                            <div class="gd-name">
                                <div class="title">{{item.title}}</div>
                            </div>
                            <div class="gd-price">
                                <div class="gd-price-now">
                                    <em>¥</em>{{item.price}}</div>
                                <div class="gd-price-ori">
                                    <em>￥{{item.price}}</em>
                                </div>
                            </div>
                        </div>
                    </a>
                    <div class="gd-cmd jAdd2Cart">
                        <i class="icon iconfont icon-cart"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
    </div> 
</template>
<script>
export default {
  name: 'youxuan',
  components: {
  },
  data () {
    return {
      list: []
    }
  },
  creater () {
    this.getGoods()
  },
  methods: {
    getGoods () {
      var _this = this
      this.loading = true
      this.$http.get('/api/goods')
        .then(function (response) {
          _this.list = _this.list.concat(response.data.data);
        })
       .catch(function (error) {
         console.log(error);
       });
    }
    // loadMore () {
    //   this.loading = true
    //   setTimeout(() => {
    //     let last = this.list[this.list.length - 1]
    //     for (let i = 1; i <= 10; i++) {
    //       this.list.push(last + i)
    //     }
    //     this.loading = false
    //   }, 500)
    // }
  }
}
</script>
<style lang="scss" >
#youxuan{margin-bottom:2rem;}

</style>


